<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">
		<!--标准mui.css-->
		<link href="../../cssmui/mui.min.css" rel="stylesheet" />
		<link href="../../cssmui/mui.picker.min.css" rel="stylesheet" />
		<!--App自定义的css-->
		<link href="../../css/hyl.css" rel="stylesheet" />
		<!--引用 js-->
		<script src="../../hyl/mui/mui.js"></script>

		<script src="../../hyl/mui/mui.picker.all.js"></script>
		<!-- 	<script src="../../mui/common.js"></script> -->
		<script src="../../js/vue.min2.6.10.js"></script>
		<script src="../../dbm/designsql.js"></script>
		<script src="../../hyl/util/core.js"></script>
		<script src="../../hyl/plus/file.js"></script>
		<script src="../../hyl/plus/sqlite.web.js"></script>
		<script src="../../hyl/plus/storage.js"></script>
		<script src="../../hyl/md/sql-modeldata.js"></script>	
		<script src="../../hyl/str/py.js"></script>
		<script src="../../hyl/mui/img.js"></script>
		<script src="../../hyl/mui/loading.js"></script>
		<script src="../../hyl/mui/data.city.3.js"></script>
		<script src="../../hyl/mui/vue-mui-ext.js"></script>
		<script src="../../hyl/mui/vue-mui-img.js"></script>
		<script src="../dao/user_dao.js"></script>
		<script src="../dao/my_conf_dao.js"></script>
		<script src="../dao/dict_dao.js"></script>

		<style type="text/css">
			.input70 {
				width: 70%;
			}

			.mui-content {
				margin-bottom: 50px
			}

			.inputlabel {
				background-color: #EEEEEE;
				padding: 5px;
			}

			input[type="text"] {
				margin-bottom: 0px;
				padding: 2px 2px;
			}

			.multiselect {
				color: #0062CC
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">联系人</h1>
		</header>

		<div class=" mui-content" id="el" v-cloak>
			<form>
				<ul class="mui-table-view">
					<li class="mui-table-view-cell ">
						<div class="mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">编号</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<input type="text" v-model="formdata.id" class="mui-input-clear" placeholder="必填">
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class="mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">昵称</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<input type="text" v-model="formdata.uname" class="mui-input-clear" placeholder="必填">
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class="mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">拼音缩写</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<input type="text" v-model="formdata.py" readonly>
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class=" mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">组群</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<mui-select ref="cgroup1" save="v" :layer="1" :options="dict.cgroup" v-model="formdata.cgroup"></mui-select>
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class=" mui-input-row ">
							<label @tap="open('usign')" class="multiselect mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">标签</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<mui-select ref="usign1" :layer="1" :options="dict.usign" v-model="formdata.usign"></mui-select>
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class=" mui-input-row ">
							<label @tap="open('ulevel')" class="multiselect mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">等级</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<mui-select ref="ulevel1" :layer="1" :options="dict.ulevel" v-model="formdata.ulevel"></mui-select>
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class="mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">联系电话</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<input type="text" v-model="formdata.tel" class="mui-input-clear" placeholder="">
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class=" mui-input-row ">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">归属省市</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<mui-select ref="ssx1" save="v" :layer="3" :options="dict.city" class="mui-ellipsis" v-model="formdata.ssx"></mui-select>
							</div>
						</div>
					</li>
					<li class="mui-table-view-cell ">
						<div class="mui-input-row li_item">
							<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">状态</label>
							<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
								<mui-switch v-model="formdata.s1"></mui-switch>
							</div>
						</div>
					</li>
				</ul>
				<div class=" mui-col-sm-12 mui-col-xs-12 li_item_label inputlabel">其他联系方式</div>
				<div>

					<div class="mui-input-row li_item">
						<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">QQ
						</label>
						<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
							<input type="text" v-model="formdata.uqq" class="mui-input-clear" placeholder="">
						</div>
					</div>
					<div class="mui-input-row li_item">
						<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">微信
						</label>
						<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
							<input type="text" v-model="formdata.wx" class="mui-input-clear" placeholder="">
						</div>
					</div>
					<div class="mui-input-row li_item">
						<label class="mui-table-cell mui-col-sm-3 mui-col-xs-3 li_item_label">email
						</label>
						<div class="mui-table-cell mui-col-sm-9 mui-col-xs-9">
							<input type="text" v-model="formdata.mail" class="mui-input-clear" placeholder="">
						</div>
					</div>
					<div class="mui-input-group ">
					</div>
				</div>
				<div class=" mui-col-sm-12 mui-col-xs-12 li_item_label inputlabel">联系人照片</div>
				<div style="padding:5px">
					<mui-up-img upurl="http://www.srv.com/upload?c=1234&s=tata" v-model="formdata.uimg"></mui-up-img>
				</div>
				<div class=" mui-col-sm-12 mui-col-xs-12 li_item_label inputlabel">地址</div>
				<div style="padding:5px">
					<textarea rows="3" v-model="formdata.addr" class="ptext mui-input-clear" style="margin:0px" placeholder="必填"></textarea>
				</div>
				<div class=" mui-col-sm-12 mui-col-xs-12 li_item_label inputlabel">备注</div>
				<div style="padding:5px">
					<textarea rows="8" v-model="formdata.remark" class="ptext" style="margin:0px" placeholder="备注"></textarea>
				</div>
				<div class=" mui-col-sm-12 mui-col-xs-12 li_item_label inputlabel">情况</div>
				<div class="mui-card">
					应收款： <br>应付款： <br>月交易： <br>交易分类：（排序） 面膜： 护手霜：
				</div>
				<br><br>
			</form>
			<nav class="mui-bar mui-bar-tab">
				<div class="mui-tab-item" @tap="onNew()">
					<span class="mui-tab-label">添加</span>
				</div>
				<a class="mui-tab-item" @tap="onSave()">
					<span class="mui-tab-label">保存</span>
				</a>
			</nav>
		</div>


	</body>

</html>

<script src="../../hyl/mui/tasker.js"></script>
<script src="../../hyl/page-muiIni.js"></script>
<script type="text/javascript">
	var _tb_contacts = null;
	var Sto_key = 'ing_contact';
	var _request = app._request || 0;
	var _subpageurls = ['class_info.html'];
	var userDao, confDao;
	var vm;

	userDao = new user_dao(_mydb_);
	confDao = new my_conf_dao(_mydb_);

	//console.log('_Dict.cgroup',_Dict.cgroup)
	//--------------创建vue实例,暂不绑定到对象------------------
	var vuedata = {
		//	el: '#el',
		data: {
			formdata: null,
			dict: {
				usign: null,
				ulevel: null,
				cgroup: _Dict.CrowdType,
				city: CityData3
			}
		},
		//定义内部方法
		methods: {
			/**渲染以后才能调用
			 * @param {Object} res
			 */
			iniDict(res) {
				var that = this;
				if (res.indexOf("usign") > -1) {
					confDao.getDict('usign', function(rc) {
						//读取数据,初始化组件
						this.dict.usign=rc;
					});
				}
				if (res.indexOf("ulevel") > -1) {
					confDao.getDict('ulevel', function(rc) {
						//读取数据,初始化组件				
						this.dict.ulevel=rc;			
					});
				}
			},
		
			onSave() {
				//if (!_IS.checkNumber(this.formdata.uname)) return;
				var ta = this;
				//console.log('onSave',this.formdata,userDao)
				userDao.MD.setObjById(this.formdata, function(s) {
					app._result.code = 1;
					//app._result.data = this.formdata;
					app.blur();
					ta.$forceUpdate();
					_STO.removeItem(Sto_key);//移除缓存
					mui.toast("数据保存完毕")
				});
			},
			open(s) {
				app.open(_subpageurls[0], s);
			}
		},
		//计算属性
		computed: {
			uname() {
				return this.formdata.uname
			}
		},
		//监听器
		watch: {
			uname(newValue, oldValue) {
				this.formdata.py = _PY.make(newValue);
			}
		},
		//数据,事件已经初始化,el未绑定,dom未渲染
		beforeMount: function() {},
		beforeCreate() {},
		created() {
			//el已绑定 dom已渲染							
			//console.log('create',this.$loading)

		},
		mounted() {},	
	};
	

	
	// 回调
	function afterWindowAck(e) {
		//console.log("afterWindowAck", e.detail.msg);
		if (e.detail.code == 1) {
			vm.iniDict(e.detail.msg);
		}
	}
	// 
	function afterPlusReady() {

		//vm.$loading();	
		var future = _Syn.Future(3, function() {
			vm = new Vue(vuedata);
			vm.$mount('#el'); // 全部完成后绑定		
		});

		//先载入指点数据
		confDao.getDict('usign', function(rc) { //读取数据,初始化组件
			vuedata.data.dict.usign = rc;
			future.light(0);
		});
		confDao.getDict('ulevel', function(rc) { //读取数据,初始化组件			
			vuedata.data.dict.ulevel = rc;
			future.light(1);
		});
		//console.log('_request',_request)
		//如果传过来id,那么从数据库查询			
		if (_request.id && _request.id > 0) {
			userDao.MD.getObjByID(_request.id, function(rs, sql) {
				// console.log()
				vuedata.data.formdata = rs;
				future.light(2);
			});
	
		} else {
			
			var data = _STO.getItem(Sto_key);
			if (!data)
				data = userDao.MD.createMData();
			
			vuedata.data.formdata = data;
			_Run.task(function() {
				console.log("renwu1",Sto_key,vuedata.data.formdata)
				_STO.setItem(Sto_key,vuedata.data.formdata);
			}
			);
			future.light(2);

		}

	}
</script>
<script src="../../hyl/pageStart.js"></script>
